<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<body>

<!-- BEGIN PAGE CONTAINER-->

<div class="container-fluid">

    <!-- BEGIN PAGE HEADER-->

    <div class="row-fluid">

        <div class="span12">

            <!-- BEGIN PAGE TITLE & BREADCRUMB-->

            <ul class="breadcrumb">

                <li>

                    <i class="icon-home"></i>

                    <a href="index.html">首页</a>

                    <i class="icon-angle-right"></i>

                </li>

                <li>

                    <a href="#">系统管理</a>

                    <i class="icon-angle-right"></i>

                </li>

                <li><a href="#">人员管理</a></li>

            </ul>

            <!-- END PAGE TITLE & BREADCRUMB-->

        </div>

    </div>

    <!-- END PAGE HEADER-->

    <!-- BEGIN PAGE CONTENT-->

    <div class="row-fluid">

        <div class="span12">

            <!-- BEGIN EXAMPLE TABLE PORTLET-->

            <div class="portlet box blue">

                <div class="portlet-title">

                    <div class="caption"><i class="icon-edit"></i>人员列表</div>

                    <div class="tools">

                        <a href="javascript:;" class="collapse"></a>

                        <a href="#portlet-config" data-toggle="modal" class="config"></a>

                        <a href="javascript:;" class="reload"></a>

                        <a href="javascript:;" class="remove"></a>

                    </div>

                </div>

                <div class="portlet-body">

                    <div class="clearfix">

                        <div class="btn-group">

                            <button id="sample_editable_1_new" class="btn green">

                                新增 <i class="icon-plus"></i>

                            </button>

                        </div>

                        <div class="btn-group pull-right">

                            <button class="btn dropdown-toggle" data-toggle="dropdown">工具 <i class="icon-angle-down"></i>

                            </button>

                            <ul class="dropdown-menu pull-right">

                                <li><a href="#">打印</a></li>

                                <li><a href="#">另存为 PDF</a></li>

                                <li><a href="#">导出到 Excel</a></li>

                            </ul>

                        </div>

                    </div>

                    <table class="table table-striped table-hover table-bordered" id="sample_editable_1">

                        <thead>

                        <tr>

                            <th>序号</th>

                            <th>用户名</th>

                            <th>邮箱</th>

                            <th>使用状态</th>

                            <th>入驻时间</th>

                            <th>更新时间</th>

                            <th>操作</th>

                        </tr>

                        </thead>

                        <tbody th:remove="all-but-first">

                        <tr class="" th:each="user,stat:${users}">

                            <td th:text="${stat.count}">序号</td>

                            <td th:text="${user.username}">用户名</td>

                            <td th:text="${user.email}">邮箱</td>

                            <td>使用状态</td>

                            <td th:text="${user.createTime}" class="center">注册时间</td>

                            <td th:text="${user.updateTime}">更新时间</td>

                            <td><a class="delete" href="javascript:;">操作</a></td>

                        </tr>

                        <tr class="">

                            <td>alex</td>

                            <td>Alex Nilson</td>

                            <td>1234</td>

                            <td class="center">power user</td>

                            <td><a class="edit" href="javascript:;">Edit</a></td>

                            <td><a class="delete" href="javascript:;">Delete</a></td>

                        </tr>

                        <tr class="">

                            <td>lisa</td>

                            <td>Lisa Wong</td>

                            <td>434</td>

                            <td class="center">new user</td>

                            <td><a class="edit" href="javascript:;">Edit</a></td>

                            <td><a class="delete" href="javascript:;">Delete</a></td>

                        </tr>

                        <tr class="">

                            <td>nick12</td>

                            <td>Nick Roberts</td>

                            <td>232</td>

                            <td class="center">power user</td>

                            <td><a class="edit" href="javascript:;">Edit</a></td>

                            <td><a class="delete" href="javascript:;">Delete</a></td>

                        </tr>

                        <tr class="">

                            <td>goldweb</td>

                            <td>Sergio Jackson</td>

                            <td>132</td>

                            <td class="center">elite user</td>

                            <td><a class="edit" href="javascript:;">Edit</a></td>

                            <td><a class="delete" href="javascript:;">Delete</a></td>

                        </tr>

                        <tr class="">

                            <td>webriver</td>

                            <td>Antonio Sanches</td>

                            <td>462</td>

                            <td class="center">new user</td>

                            <td><a class="edit" href="javascript:;">Edit</a></td>

                            <td><a class="delete" href="javascript:;">Delete</a></td>

                        </tr>

                        <tr class="">

                            <td>gist124</td>

                            <td>Nick Roberts</td>

                            <td>62</td>

                            <td class="center">new user</td>

                            <td><a class="edit" href="javascript:;">Edit</a></td>

                            <td><a class="delete" href="javascript:;">Delete</a></td>

                        </tr>

                        </tbody>

                    </table>

                </div>

            </div>

            <!-- END EXAMPLE TABLE PORTLET-->

        </div>

    </div>

    <!-- END PAGE CONTENT -->

</div>

<!-- END PAGE CONTAINER-->

<script>
    $(function () {

        TableEditable.init();

    });
</script>

</body>
</html>